<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <link rel="stylesheet" href="../res/layui/css/layui.css">
    <style>
        .form-container {
            max-width: 600px;
            margin: 0 auto;
        }
        .form-title {
            font-size: 18px;
            margin-bottom: 20px;
            text-align: center;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="form-container">
        <div class="form-title">修改密码</div>
        <form class="layui-form layui-form-pane" id="passwordForm">
            <input type="hidden" name="id" id="adminId" value="">
            
            <div class="layui-form-item">
                <label class="layui-form-label">旧密码</label>
                <div class="layui-input-block">
                    <input type="password" name="oldPassword" id="oldPassword" value="" 
                           lay-verify="required" 
                           lay-vertype="tips" 
                           placeholder="请输入旧密码" 
                           autocomplete="off" 
                           class="layui-input" 
                           lay-affix="eye">
                </div>
            </div>
            
            <div class="layui-form-item">
                <label class="layui-form-label">新密码</label>
                <div class="layui-input-block">
                    <input type="password" name="newPassword" id="newPassword" value="" 
                           lay-verify="required|password" 
                           lay-vertype="tips" 
                           placeholder="请输入新密码" 
                           autocomplete="off" 
                           class="layui-input" 
                           lay-affix="eye">
                </div>
            </div>
            
            <div class="layui-form-item">
                <label class="layui-form-label">确认密码</label>
                <div class="layui-input-block">
                    <input type="password" name="confirmPassword" value="" 
                           lay-verify="required|confirmPassword" 
                           lay-vertype="tips" 
                           placeholder="请再次输入新密码" 
                           autocomplete="off" 
                           class="layui-input" 
                           lay-affix="eye">
                </div>
            </div>
            
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" lay-submit lay-filter="submitPassword">修改密码</button>
                    <button type="button" class="layui-btn layui-btn-primary" id="cancelBtn">取消</button>
                </div>
            </div>
        </form>
    </div>
</div>

<script src="../res/layui/layui.js"></script>
<script>
    layui.use(['form', 'layer', 'jquery'], function() {
        // 获取form对象
        var form = layui.form;
        var layer = layui.layer;
        var $ = layui.jquery;
        
        // 从localStorage或其他地方获取当前登录的管理员ID
        // 这里假设从localStorage获取，实际项目中可能需要根据具体情况调整
        var currentAdminId = localStorage.getItem('adminId') || '1'; // 临时设置默认值为1
        $('#adminId').val(currentAdminId);
        
        // 自定义验证规则
        form.verify({
            password: [
                /^[\S]{6,12}$/,
                '密码必须6到12位，且不能出现空格'
            ],
            confirmPassword: function(value) {
                var newPassword = $("input[name='newPassword']").val();
                if(value !== newPassword) {
                    return '两次输入的新密码不一致';
                }
            }
        });

        // 提交事件
        form.on('submit(submitPassword)', function(data) {
            var field = data.field; // 获取表单字段值
            
            // 构建请求数据
            var requestData = {
                id: field.id,
                password: field.newPassword,
                oldPassword: field.oldPassword
            };
            
            // 发送修改密码请求
            $.ajax({
                url: '/admin/updatePassword',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify(requestData),
                success: function(R) {
                    if (R.code === 200) {
                        layer.msg('密码修改成功', {icon: 6});
                        // 延迟返回首页或刷新页面
                        setTimeout(function() {
                            window.location.href = '../index.html';
                        }, 1500);
                    } else {
                        layer.msg(R.message || '密码修改失败', {icon: 5});
                    }
                },
                error: function() {
                    layer.msg('网络错误，请稍后重试', {icon: 5});
                }
            });
            
            return false; // 阻止默认 form 跳转
        });
        
        // 取消按钮点击事件
        $('#cancelBtn').on('click', function() {
            // 返回首页
            window.location.href = '../index.html';
        });
    });
</script>
</body>
</html>